@keyframes loading {
    from  {
        transform: rotateZ(0deg);
    }
    to {
        transform: rotateZ(360deg);
    }
}
body {
    background-color: #f2f2f2;
}
.layout {
    margin-top: 90/37.5rem;
    .header {
        width: 100%;
        height: 90/37.5rem;
        text-align: center;
        line-height: 90/37.5rem;
        font-size: 34/37.5rem;
        color: #fff;
        background-color: #141414;
        position: fixed;
        top: 0;
        left: 0;
        .backArrow {
            width: 40/37.5rem;
            height: 90/37.5rem;
            background: url("../../img/back_W@3x.png") no-repeat left center;
            background-size: 60/37.5rem 60/37.5rem;
            position: absolute;
            top: 0;
            left: 25/37.5rem;
        }
        .save {
            font-size: 30/37.5rem;
            color: #ffd11a;
            height: 90/37.5rem;
            line-height: 90/37.5rem;
            position: absolute;
            top: 0;
            right: 35/37.5rem;
        }
    }
    .myMsg {
        .headPic {
            width: 100%;
            height: 141/37.5rem;
            padding-left: 30/37.5rem;
            padding-right: 30/37.5rem;
            background-color: #fff;
            box-sizing: border-box;
            input {
                display: none;
            }
            .headText {
                float: left;
                font-size: 32/37.5rem;
                height: 140/37.5rem;
                line-height: 140/37.5rem;
            }
            .picAdnArrowIcon {
                float: right;
                height: 140/37.5rem;
                .pic {
                    float: left;
                    width: 92/37.5rem;
                    height: 92/37.5rem;
                    border-radius: 50%;
                    margin-top: 24/37.5rem;
                    overflow: hidden;
                    img {
                        display: block;
                        width: 100%;
                        height: 100%;
                    }
                }
                .arrowIcon {
                    float: left;
                    width: 36/37.5rem;
                    height: 140/37.5rem;
                    margin-left: 30/37.5rem;
                    background: url("../../img/llgo@3x.png") no-repeat center center;
                    background-size: 36/37.5rem 34/37.5rem;
                }
            }
        }
        .bindPhone {
            width: 100%;
            height: 91/37.5rem;
            border-top: 1px solid #f2f2f2;
            padding-left: 30/37.5rem;
            padding-right: 30/37.5rem;
            margin-bottom: 20/37.5rem;
            background-color: #fff;
            box-sizing: border-box;
            .text,.phone {
                float: left;
                height: 90/37.5rem;
                line-height: 90/37.5rem;
                font-size: 32/37.5rem;
            }
            .phone {
                float: right;
            }
        }
        .nickName {
            width: 100%;
            height: 91/37.5rem;
            border-bottom: 1px solid #ebebeb;
            padding-left: 30/37.5rem;
            padding-right: 30/37.5rem;
            background-color: #fff;
            box-sizing: border-box;
            .text {
                float: left;
                font-size: 32/37.5rem;
                color: #1f1f1f;
                height: 90/37.5rem;
                line-height: 90/37.5rem;
            }
            input {
                float: right;
                border: none;
                outline: none;
                text-align: right;
                height: 90/37.5rem;
                font-size: 32/37.5rem;
            }
        }
        .gender,.choseDate {
            width: 100%;
            height: 91/37.5rem;
            border-bottom: 1px solid #ebebeb;
            padding-left: 30/37.5rem;
            padding-right: 30/37.5rem;
            background-color: #fff;
            box-sizing: border-box;
            .text {
                float: left;
                font-size: 32/37.5rem;
                color: #1f1f1f;
                height: 90/37.5rem;
                line-height: 90/37.5rem;
            }
            .chose {
                float: right;
                height: 90/37.5rem;
                .selectGender,.date {
                    float: left;
                    height: 90/37.5rem;
                    line-height: 90/37.5rem;
                    font-size: 26/37.5rem;
                    color: #a3a3a3
                }
                .arrowIcon {
                    float: left;
                    width: 36/37.5rem;
                    height: 90/37.5rem;
                    margin-left: 20/37.5rem;
                    background: url("../../img/llgo@3x.png") no-repeat center center;
                    background-size: 36/37.5rem 34/37.5rem;
                }
            }
        }
    }
    .logoutMarsk {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        background-color: rgba(0,0,0,.3);
        .stips {
            width: 600/37.5rem;
            border-radius: 5px;
            background-color: #fff;
            box-sizing: border-box;
            position: fixed;
            top: 50%;
            margin-top: -200/2/37.5rem;
            left: 50%;
            margin-left: -600/2/37.5rem;
            .titleText {
                height: 140/37.5rem;
                .title {
                    font-weight: 700;
                    font-size: 36/37.5rem;
                    padding-top: 10/37.5rem;
                    padding-bottom: 20/37.5rem;
                }
                .title,.text {
                    text-align: center;
                    color: #1f1f1f;
                    font-size: 30/37.5rem;
                }
            }
            .btn {
                height: 80/37.5rem;
                border-top: 1px solid #ebebeb;
                font-size: 30/37.5rem;
                color: #39B5E6;
                .sure {
                    float: left;
                    width: 50%;
                    height: 80/37.5rem;
                    border-right: 1px solid #ebebeb;
                    text-align: center;
                    line-height: 80/37.5rem;     
                    box-sizing: border-box;
                }
                .cancel {
                    float: left;
                    width: 50%;
                    height: 80/37.5rem;
                    text-align: center;
                    line-height: 80/37.5rem;
                }
            }
        }
    }
    .tips {
        display: none;
        width: 400/37.5rem;
        height: 80/37.5rem;
        font-size: 30/37.5rem;
        line-height: 80/37.5rem;
        text-align: center;
        color: #fff;
        border-radius: 40/37.5rem;
        opacity: 0;
        background-color: #1f1f1f;
        position: fixed;
        bottom: 150/37.5rem;
        left: 50%;
        margin-left: -200/37.5rem;
    }
    .loadingMarsk {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        background-color: rgb(255,255,255);
        .loadingPic {
            width: 72/37.5rem;
            height: 72/37.5rem;
            position: fixed;
            top: 50%;
            left: 50%;
            margin-top: -36/37.5rem;
            margin-left: -36/37.5rem;
            .rotatePic {
                width: 72/37.5rem;
                height: 72/37.5rem;
                position: fixed;
                top: 50%;
                left: 50%;
                margin-top: -36/37.5rem;
                margin-left: -36/37.5rem;
                animation: loading 1s linear infinite;
                img {
                    display: block;
                    width: 100%;
                    height: 100%;
                }
            } 
            .centerPic {
                width: 62/37.5rem;
                height: 62/37.5rem;
                position: fixed;
                top: 50%;
                left: 50%;
                margin-top: -31/37.5rem;
                margin-left: -31/37.5rem;
                img {
                    display: block;
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
}